<template>
    <div class="pages">
        <div class="login_form">
            <h3>云账管理专家</h3>
            <div>
                <span>用户名:</span>
                <el-input class="select_input1" size="small" v-model="form.name" placeholder="用户名"></el-input>
            </div>
            <div>
                <span>密&nbsp;&nbsp;&nbsp;码:</span>
                <el-input type="password" class="select_input1" size="small" v-model="form.password" placeholder="密码"></el-input>
            </div>
            <button class="login_button" @click="login">登录</button>
        </div>
        <div class="bottomTile">版权所有:天津艾克网络技术有限公司 2021</div>
    </div>
</template>
 
<script>
    export default {
        name: 'login',
        components:{
        },
        data () {
            return {
                form:{}
            }
        },
        created:function () {
            // this.$emit('header', false);
            var lett = this;
            document.onkeydown = function(e){
                var key = window.event.keyCode;
                if (key == 13) {
                    lett.login();
                }
            }
        },
         methods: {
             login:function(){
                if(!this.form.name){
                    this.$message.error('请输入用户名');
                    return;
                }
                if(!this.form.password){
                    this.$message.error('请输入密码');
                    return;
                }
                var that = this
                this.$post('login/login',this.form).then((res) => {
                    if(res.code == 0){
                        that.$message.error(res.msg);
                    }
                    localStorage.setItem('store_id',res.data.id)
                    localStorage.setItem('user_id',res.data.user_id)
                    localStorage.setItem('name',res.data.name)
                    localStorage.setItem('logo',res.data.logo)
                    localStorage.setItem('expireTime',res.data.expireTime)
                    localStorage.setItem('user_name',res.data.username)
                    that.$router.push({ path: '/' });
                })
             }
         }
    }
</script>
<style>
.pages{
    min-height: 100%;
    overflow: hidden;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    position: relative;
    margin: 0 auto;
    background: url(../../assets/bg2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
.login_button{
    width:180px;
    height:35px;
    line-height:35px;
    text-align:center;
    background:#3399ff;
    margin-top:40px;
    border-radius:10px;
    border:none;
    color:#fff;
}
.bottomTile{
    color: #fff;
    font-size: 14px;
    position: fixed;
    bottom: 20px;
    left: 40%;
}
.login_form{
    z-index:0;
    right: 10%;
    position: absolute;
    top: 15%;
    padding: 4% 0;
    width: 36%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    background: rgba(37,59,219,.3);
    color: #fff;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 5px;
}
body{
    margin:0 !important;
    padding:0 !important;
}
</style>